<!-- 项目佣金激励报表的详情页面-->
<template>
  <div class="staffCommissionView">
    <el-breadcrumb separator="/" class="bread-title">
      <el-breadcrumb-item :to="{ path: '/projectCommissionIncentiveStatement' }">项目佣金激励报表</el-breadcrumb-item>
      <el-breadcrumb-item>查看</el-breadcrumb-item>
    </el-breadcrumb>
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item label="楼盘名称：">
        <el-input placeholder="请输入楼盘名称" v-model.trim="form.devName"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="getSearch" id="monitorEnter">查询</el-button>
        <el-button type="primary" @click="exportOrder">导出订单</el-button>
        <el-button type="primary" v-if="beforeAdjust" @click="beforeAdjustment">调整前报表</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="tableData" border>
      <el-table-column :index="typeIndex" type="index" label="序号" width="50" align="center"></el-table-column>
      <el-table-column label="项目" :formatter="devName" align="center"></el-table-column>
      <el-table-column
        v-for="item in headerList"
        :key="item.id"
        :label="item.headerName"
        align="center"
      >
        <template slot-scope="scope">{{formatMoney(scope.row[item.headerId])}}</template>
      </el-table-column>
      <el-table-column v-if="beforeAdjust" align="center" label="订单明细">
        <template slot-scope="scope">
          <el-button v-if="scope.$index !== 0" @click="goDetail(scope.row.devId)" type="text">查看</el-button>
          <span v-else>——</span>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagebar">
      <el-pagination
        background
        layout="total, sizes, prev, pager, next, jumper"
        :current-page.sync="form.pageNum"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="form.pageSize"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :total="total"
      ></el-pagination>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
import utils from "@/common/utils.js";
export default {
  name: "projectCommissionIncentiveView",
  data() {
    return {
      form: {
        devName: "",
        pageSize: 10,
        pageNum: 1,
        month: "2019-12",
        beforeFlag: 0
      },
      time: [],
      total: 0,
      beforeAdjust: true,
      headerList: [],
      tableData: []
    };
  },
  created() {
    this.form.month = this.$route.query.month;
    this.getList();
  },
  mounted() {
    if (window.history && window.history.pushState) {
      window.history.pushState(null, null, document.URL);
      window.addEventListener("popstate", this.goBack, false);
    }
  },
  destroyed() {
    window.removeEventListener("popstate", this.goBack, false);
  },
  methods: {
    devName(row) {
      if(!row.devName) {
        return "——"
      }
      return row.devName;
    },
    formatMoney(num) {
      if(num === null) {
        return "——"
      }
      return utils.formatMoney(num);
    },
    goBack() {
      if (!this.beforeAdjust) {
        this.beforeAdjust = true;
        this.form.beforeFlag = 0;
        this.getList();
      }
    },
    getList() {
      this.$axios
        .post("/commallocation/orderDrawInfo/devPageList", this.form)
        .then(res => {
          this.headerList = res.headerList;
          this.tableData = res.pageInfo.list;
          this.tableData.unshift(res.sumMap);
          this.total = res.pageInfo.total;
        });
    },
    typeIndex(key) {
      if (key === 0) {
        return "合计";
      } else {
        return key;
      }
    },
    exportOrder() {
      let beforeFlag;
      if(this.beforeAdjust) {
        beforeFlag = 0
      }else {
        beforeFlag = 1
      }
      window.open(this.$axios.baseURL + '/commallocation/staff/downloadTemplateExcel?templateType=项目佣金激励报表&month=' + this.form.month + '&beforeFlag=' + beforeFlag);
    },
    getSearch() {
      this.form.pageNum = 1;
      this.getList();
    },
    beforeAdjustment() {
      this.beforeAdjust = false;
      this.form.beforeFlag = 1;
      this.getList();
    },
    goDetail(devId) {
      this.$router.push({
        path: "/projectCommissionIncentiveViewDetail",
        query: {
          devId: devId,
          month: this.form.month
        }
      });
    },
    settlement() {
      this.$confirm("是否结算，结算后不可更改报表，是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$axios.post("").then(res => {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    handleCurrentChange() {
      this.getList();
    },
    handleSizeChange(val) {
      this.form.pageSize = val;
      this.getList();
    }
  }
};
</script>

<style lang="stylus"></style>
